<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>首页</title>
<link href="CSS/style01.css" rel="stylesheet" type="text/css">
<style type="text/css">
#contrainer {
		position: relative;/*表示将contrainer盒子设置为相对定位*/
		width:1200px;
		margin:0 auto;
		height: 470px;
		background-color:#FFF;
		background: url(zuoye/ico5.gif) no-repeat -2px 16px;
	}
/*图片新闻*/
#contrainer #tpnews{
		width:300px;		/*设置图片新闻栏目宽度*/
		height:230px;		/*设置图片新闻栏目高度*/
		position:absolute;	/*设置图片新闻栏目定位属性为绝对定位，参考对象为contrainer）*/
		left:5px;			/*设置图片新闻栏目距#contrainer的左边5像素*/
		top:8px;			/*设置图片新闻栏目距contrainer的上边0像素，即与contrainer顶部对齐*/
	}

.fnt2{
		color: #CC0033;
	}
.fnt3 {
		font-size: 15px;
		font-weight: bold;
		line-height: 30px;
		padding-left: 10px;
	}
#imgnews img {
		height: 188px; 				/*设置图片高度*/
		width: 288px; 				/*设置图片宽度*/
		position: relative;			/*对元素应用相对定位属性*/
		top: 10px; 
		right: 5px;					/*相对图片原来的上边缘位置下移6px*/
	}
#tpnews #imgnews {
		background-image: url(zuoye/imgbg.gif) no-repeat;
		height: 200px;
		text-align: center;
		width: 300px;
		position: relative;		     /*设置相对定位，以便将imgnews盒子作为祖先元素*/
	}
#imgnews #tpbtn {
		height: 20px;
		width: 90px;
		position: absolute; 			/*设置绝对定位*/
		right: 5px; 						/*距imgnews右边框5像素*/
		bottom: 5px; 						/*距imgnews下边框5像素*/
	}
.fang {
		float: left; 						/*设置左浮动*/
		height: 15px; 						/*设置图片按钮高度*/
		width: 15px; 						/*设置图片按钮宽度*/
		margin-left: 5px; 					/*设置图片按钮左外边距*/
		background-color: #CC0000; 		    /*设置图片按钮背景颜色*/
		color: #FFFFFF; 					/*设置图片按钮文字颜色*/
	}
#imgnews .imgdiv{
	height: 188px;
	width: 288px;
	position: absolute;
	top: 6px;
	left: 10px;
}

/*集团新闻*/
#contrainer #jtnews{
		width: 480px;    	/*设置集团新闻栏目宽度*/
		height:245px;		/*设置集团新闻栏目高度*/
		position: absolute;	/*设置集团新闻栏目定位属性为绝对定位，参考对象为contrainer*/
		left: 310px; 		/*设置集团新闻栏目距contrainer左边310像素*/
		top: 0px; 		    /*设置图片新闻栏目距contrainer上边0像素*/
	}
h1 {
		line-height: 30px; 									/*设置行高*/
		border-bottom: 1px solid #FF0000; 					/*设置下边框*/
		font-family: "宋体";						    	   /*设置字体*/
		font-size: 14px; 									/*设置文字大小*/
		padding-left: 20px; 								/*设置左内边距*/
		background: url(zuoye/ico5.gif) no-repeat 3px 7px; /*设置背景图片*/
	}
#jtnews li{
		background: url(zuoye/ico1.gif) no-repeat 0px 5px; 	/*设置背景*/
		line-height: 25px; 								  	/*设置行高*/
		border-bottom: 1px dotted #999999; 					/*设置下边框*/
		width: 480px; 									/*设置宽度*/
		height: 25px; 										/*设置高度*/
		overflow: hidden;									/*隐藏超过列表宽度的部分*/
		position:relative;						        /*表明可以做新闻时间的祖先元素*/
	}
#jtnews li a{
	padding-left:10px; 								/*设置超链接左内边距*/
	text-decoration:none; 							/*去除超链接下划线*/
	color: #333333; 								/*设置超链接颜色*/
	}
#jtnews li a:hover{
	color:#FF0000; 								    /*设置鼠标访问时的超链接颜色*/
	}    
.ntime {
		position: absolute;							/*使用绝对定位*/
		top: 0px; 									/*距li块上边缘0像素*/
		right: 0px; 									/*距li块右边缘0像素*/
		font-family: "Times New Roman", Times, serif; 		/*设置字体*/
		font-size: 10px; 							/*设置文字大小*/
		background-color: #FFFFFF;
		padding-left: 1px;							/*设置一点间距*/
	}
/*重点关注*/
#contrainer #zdgz{
		width:360px;
		height:250px;
		line-height:25px;
		position:absolute;	/*设置公司简介栏目的定位属性为绝对定位，参考对象为contrainer*/
		top: 0px;			/*设置公司简介栏目距contrainer的上边0个像素*/
		right: 15px;		/*设置公司简介栏目距contrainer右边5个像素*/
	}
.right {
		float: left;
		padding-right:10px;
		padding-top:10px;
	}
/*项目展示*/
#contrainer #xmshow {
		position:absolute;	/*设置项目展示栏目定位属性为绝对定位，参考对象为contrainer*/
		left: 5px; 		    /*设置项目展示栏目距contrainer的左边5个像素*/
		top: 250px; 		/*设置项目展示栏目距contrainer的上边250个像素*/
		width: 820px;
		height: 210px;
	}
#xmshow img{
		height: 160px; 				/*设置高度*/
		width: 151px; 				/*设置宽度*/
		margin: 5px 0 5px 5px; 		/*设置上、右、下、左外边距*/
	}
/*站内搜索*/
#contrainer #searcher {
	width: 360px;
	height: 158px;
	position: absolute; /*设置站内搜索栏目的定位属性为绝对定位，参考对象为contrainer*/
	top: 300px;
	right: 12px;
	text-align: center;
	background: url(zuoye/searchbg.jpg) no-repeat;
}
/*------------------内容结束-------------------*/

</style>
<script type="text/javascript">
	function changeTp(va1){
		if(va1==0){
			document.getElementById("bannerTp").src = "zuoye/6.jpg";
	}else{
		document.getElementById("bannerTp").src ="zuoye/7.jpg";
	}
	}
	function changeImage(maxval,val){
		var len =maxval - val;
		for(var i=val,j=val;i<=4;i++,j--){
			var dn = "imgdiv"+i;
			document.getElementById(dn).style.zIndex=j;
		}
	}
	</script>
</head>

<body>
<header>
  	<img id="logo" src="zuoye/logo.jpg" width="230" height="54" class= "left" alt="img">
	<nav id="menu"> 
		<a href="#" class="selected">首   页</a> 
		<a href="dierye.html">地区简介</a>
		<a href="jingdian.html">旅游景点</a>
		<a href="product01.html">出行路线</a>
		<a href="meishi.html">特色美食</a>
		<a href="zhuce(1).html">网上预订</a>
		<a href="#">游记攻略</a>
		<a href="#">摄影写真</a>
		<a href="#">装备商城</a>
		
	</nav>
	<img id="bannerTp" src="zuoye/6.jpg" width="1200" height="300" alt="" onMouseOver="changeTp(1)" onMouseOut="changeTp(0)" />
</header>
<div id="contrainer">
	<div id="tpnews"> 
	  <div class="fnt3"><span class="fnt2">美食</span>展示</div>
  	  <div id="imgnews">
  	  		<div id="imgdiv4" class="imgdiv"><a href="meishi.html"><img src="zuoye/19.jpg" width="288" height="188" alt=""></a></div>

  	  		<div id="imgdiv3" class="imgdiv"><a href="meishi.html"><img src="zuoye/11.jpg" width="288" height="188" alt=""></a></div>

  	  		<div id="imgdiv2" class="imgdiv"><a href="meishi.html"><img src="zuoye/13.jpg" width="288" height="188" alt=""></a></div>

			<div id="imgdiv1" class="imagdiv"><a href="meishi.html"><img src="zuoye/12.jpg" width="288" height="188" alt=""/></a></div>
			<div id="tpbtn" style="z-index: 4">
			  <div class="fang" onClick="changeImage(4,1)">1</div>
			  <div class="fang" onClick="changeImage(4,2)">2</div>
			  <div class="fang" onClick="changeImage(4,3)">3</div>
			  <div class="fang" onClick="changeImage(4,4)">4</div>
			</div>
	  	</div>
  </div>
	<div id="jtnews">
	<h1>重点新闻</h1>
		<ul>
			<li><a href="#">公主岭市获批全国中小城市综合改革试点(全国61个试点地区)。<span class="ntime">[2015-11-23] </span></a> </li>
			 <li><a href="news01.html">公主岭市位列中国县域综合竞争力第75名。<span class="ntime">[2015-09-22]</span> </a></li>
			 <li><a href="#">公主岭市位列全国百强县第93名。 <span class="ntime">[2014-09-16] </span></a> </li>
			 <li><a href="#">撤销怀德县革命委员会，成立怀德县人民政府。<span class="ntime"> [1980-07-20] </span></a> </li>
			 <li><a href="#">公主岭市降为镇。辖15个社、镇。<span class="ntime">[1959-03-14] </span></a> </li>
			 <li><a href="#">公主岭市定为区级市，隶属于怀德县。<span class="ntime">[1952-09-21] </span> </a> </li>
			 <li><a href="#">划归辽北省后方办事处,划归辽吉区第二专区。<span class="ntime"> [1948-02-30]</span></a> </li>      
			 <li><a href="#">日伪将东北划分为14省，怀德县划归吉林省。<span class="ntime">[1934-12-11] </span></a> </li>
		</ul>
  </div>
    <div id="zdgz"> 
	  <h1>地点介绍</h1>
    	<p><a href="dierye.html"><img src="zuoye/8.jpg" width="160" height="93" class="right" alt="" title="公主岭"/></a>公主岭市，吉林省省直管市，地处吉林省中西部，东辽河中游右岸。位于东经124°02´至125°18´，北纬43°11´至44°09´之间。<p>最东点始于响水镇刘小窝堡村，最西点止于桑树台镇村围子里屯，最南点起于龙山乡建设村二龙屯，最北点止于双城堡镇玛瑙村泡子沿屯。市境东西宽106公里，南北宽111公里，总面积4058平方公里。</p>
  </div>
    <div id="xmshow">
		<h1>著名景点</h1>
		<marquee behavior="alternate"> 
	  <a href="jingdian.html"><img src="zuoye/a.jpg" width="154" height="160" alt="" title="响铃公园" /></a>
	  <a href="jingdian.html"><img src="zuoye/b.jpg" width="154" height="160" alt="" title="二龙湖" /></a>
	  <a href="jingdian.html"><img src="zuoye/c.jpg" width="154" height="160" alt="" title="秦家屯"/></a>
	  <a href="jingdian.html"><img src="zuoye/d.jpg" width="154" height="160" alt="" title="博物馆"/></a>
      <a href="jingdian.html"><img src="zuoye/e.jpg" width="154" height="160" alt="" title="玫瑰山"/></a>
      </marquee>
	</div>
    <div id="searcher">  
	 <div class="fnt3"><span class="fnt2">地点</span>搜索</div>
       <br>
         <span class="fnt2">关键字</span>
         <input name="input" type="text">
       <br>
       <br>
        <input name="imageField" type="image" id="imageField" src="zuoye/top_search_btn.jpg" align="middle" alt="img">
	</div>
</div>

  <footer>公主岭旅游文化发展中心 版权所有 公ICP备 03047106号<br>
  地址：吉林省公主岭市<br>
电话：0434-18066059 传真：0434-68314789 邮箱：wangping187.com</footer>

</body>
</html>
